﻿@{
    ViewBag.Title = "Metering Dashboard";
    Layout = "~/Views/Shared/_Layout.cshtml";
}

@section header {
    <script language="javascript">
        var currentDate = new Date();
        var month = Number(@(this.ViewBag.Month)) || (currentDate.getMonth() + 1);
        var year = Number(@(this.ViewBag.Year)) || currentDate.getFullYear();
    </script>

    <script language="javascript" src="@Url.Content("~/Scripts/cloudninja/pages/cloudninja.metering.pages.VendorTenantList.js")"></script>
}

<div class="page vendorTenantList">
    <h1 class="pageHeader">Tenants</h1>

    @Html.Partial("DashboardNav")
    
    <div id="timePeriodContainer">
        <div class="label"></div>
    </div>
    
    <div class="clear"></div>
    
    <br/>

    <table id="tenantList">
        <thead>
            <tr class="head">
                <th rowspan="2" class="tenantColumn">Tenant</th>
                <th colspan="4">Total Resource Usage</th>
            </tr>
            <tr>
                <th>Database (kb)</th>
                <th>Storage (kb)</th>
                <th>Bandwidth (kb)</th>
                <th>Total Weighted Usage</th>
            </tr>
        </thead>
        @*<tbody id="topdblist">
            <tr>
                <td colspan="2">loading...</td>
            </tr>
        </tbody>*@
    </table>
    
    <script id="tenantColumnTemplate" type="text/html">
        <div>
            <div class="tenantContainer">
                <span>${TenantId}</span>
                <a href="/Home/TenantDashboard?tid=${TenantId}&month=${Month}&amp;year=${Year}"><img src="/Images/info-more.png" /></a>
            </div>
        </div>
    </script>
</div>
